<?php include "../public/header.php";?>
<?php include "../public/header_public.php";?>
<link rel='stylesheet' href='/static/admin/css/ban.css'>
<script type="text/javascript" src="/static/admin/echarts/echarts.min.js"></script>
<style>
    .xm-label-block{border: unset!important;}
    .xm-label-block span{font-size: 16px!important;}
    .xm-icon-close{display: none!important;}
    .leftengin .tuo:hover,.danbox:hover{background: #f6f6f6 !important;}
    #role1{float: left}
    .busdiv{width: 200px;float: left;margin-left: 20px}
    .busdiv input{height: 30px!important;}
    #bancha{height: 28px;line-height: 28px;margin-top: 2px!important;padding-top: 0!important;}
    #bancha{height: 28px;line-height: 28px;margin-left: 20px}
    .layui-select-title input{height: 30px}
    #banreset{height: 28px;line-height: 28px;margin-top: 2px!important;padding-top: 0!important;background-color: #FFFFFF!important;}
    #banreset{height: 28px;line-height: 28px;color: #2272eb!important;}

    .busdiv222{float: right;margin-right: 20px}
    #but_ban_lian{color: #2272eb!important;background-color: #FFFFFF!important;}
    #but_ban_cai{color: #2272eb!important;background-color: #FFFFFF!important;}
</style>
<body id="banZiPage">
<div id="banBox">
    <div class="minbox" style="margin-bottom: 10px;padding-top: 10px;height: 40px;">
        <div id="role1">
            <div id="chanid" class="xmselect_div" style="width: 300px;height: 40px;margin-left: 20px"></div>
        </div>
        <div id="enginidstr" class="layui-hide"></div>

        <div class="busdiv layui-form">
            <input type="text" name="enginname" placeholder="项目名称" class="layui-input" autocomplete="off">
        </div>
        <div class="busdiv layui-form">
            <input type="text" name="man_xiang" placeholder="业务对接人" class="layui-input" autocomplete="off">
        </div>
        <div class="busdiv layui-form">
            <div id="engintype" class="xmselect_div"></div>
        </div>
        <div class="busdiv layui-form" style="width: 80px;">
            <button class="laytp-btn laytp-btn-md laytp-btn-primary" id="bancha" type="button"><i class="layui-icon layui-icon-search"></i>查询</button>
        </div>
        <div class="busdiv layui-form" style="margin-left: 10px!important;">
            <button class="laytp-btn laytp-btn-md laytp-btn-primary"  id="banreset" type="button"><i class="layui-icon layui-icon-refresh"></i>重置</button>
        </div>
        <div class="busdiv222 layui-form">
            <button class="laytp-btn laytp-btn-md laytp-btn-primary" id="but_ban_cai" type="button">财务看板</button>
        </div>
        <div class="busdiv222 layui-form">
            <button class="laytp-btn laytp-btn-md laytp-btn-primary" id="but_ban_lian" type="button">联营项目看板</button>
        </div>
        <div class="busdiv222 layui-form">
            <button class="laytp-btn laytp-btn-md laytp-btn-primary" id="but_ban_zi" type="button">自营项目看板</button>
        </div>
    </div>
    <div class="conbox">
        <div class="topbox">
            <div class="he he1">
                <div class="w1">在建项目数量</div>
                <div class="w2" id="top_zai">0</div>
                <img src="/static/admin/images/ban/top_7.png">
            </div>
            <div class="he he2">
                <div class="w1">施工合同总额</div>
                <div class="w2" id="top_shimoney">0</div>
                <img src="/static/admin/images/ban/top_5.png">
            </div>
            <div class="he he3">
                <div class="w1">总产值（万元）</div>
                <div class="w2" id="top_chan">0</div>
                <img src="/static/admin/images/ban/top_9.png">
            </div>
            <div class="he he4">
                <div class="w1">总收入（万元）</div>
                <div class="w2" id="top_huikuan">0</div>
                <img src="/static/admin/images/ban/top_10.png">
            </div>
            <div class="he he5">
                <div class="w1">资金余额</div>
                <div class="w2" id="top_yufee">0</div>
                <img src="/static/admin/images/ban/top_8.png">
            </div>
        </div>
        <div class="clear"></div>
        <div class="botbox">
            <div class="zuo">
                <div class="thd">资金分析</div>
                <div class="tbd" id="zixi">
                    <div class="gtou">
                        <div class="t1">资金余额</div>
                        <div class="t2" id="za_yufee">0</div>
                        <div class="t3 layui-form">
                            <select id="zifen_year" name="zifen_year" lay-filter="zifen_year"></select>
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_zifen" style="margin-top: 10px"></div>
                </div>
                <div class="thd">收入分析</div>
                <div class="tbd" id="xiangshou">
                    <div class="gtou">
                        <div class="t1">产值合计</div>
                        <div class="t2" id="za_chan">0</div>
                        <div class="t3 layui-form">
                            <select id="chanhe_year" name="chanhe_year" lay-filter="chanhe_year"></select>
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_chanhe"></div>

                    <div class="gtou">
                        <div class="t1">回款合计</div>
                        <div class="t2" id="za_huikuan">0</div>
                        <div class="t3 layui-form">
                            <select id="huihe_year" name="huihe_year" lay-filter="huihe_year"></select>
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_huihe"></div>

                    <div class="gtou">
                        <div class="t1">应收风险</div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="yingbox">
                        <div class="bl">
                            <div>应收未收（按合同）<span id="noshou_he">0</span></div>
                            <div>应收未收（按产值）<span id="noshou_chan">0</span></div>
                            <div>应收未收（按开票）<span id="noshou_kai">0</span></div>
                        </div>
                        <div class="br" id="chart_yingxian"></div>
                    </div>
                </div>
            </div>
            <div class="zho">
                <div class="thd">支出分析</div>
                <div class="tbd" id="zixi">
                    <div class="gtou">
                        <div class="t1">采购合同总额（含变更）</div>
                        <div class="t2" id="za_caimoney">0</div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_hecai"></div>

                    <div class="gtou">
                        <div class="t1">项目支出</div>
                        <div class="t2" id="za_xiangzhi">0</div>
                        <div class="t3 layui-form">
                            <select id="xiangzhi_year" name="xiangzhi_year" lay-filter="xiangzhi_year"></select>
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_xiangzhi"></div>

                    <div class="gtou">
                        <div class="t1">应付风险</div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="yingbox">
                        <div class="bl">
                            <div>应付未付（按结算）<span id="nofu_jie">0</span></div>
                            <div>应付未付（按收票）<span id="nofu_shou">0</span></div>
                        </div>
                        <div class="br" id="chart_fuxian"></div>
                    </div>

                </div>
                <div class="thd">成本分析</div>
                <div class="tbd" id="zixi">
                    <div class="gtou">
                        <div class="t1">总成本</div>
                        <div class="t2" id="za_zongcheng">0</div>
                        <div class="t2" style="float: right;margin-right: 30px" id="za_zhicheng">0</div>
                        <div class="t1" style="float: right">直接成本</div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_zongcheng"></div>

                    <div class="gtou">
                        <div class="t1">管理费成本</div>
                        <div class="t2" id="za_guancheng">0</div>
                    </div>
                    <div class="clear"></div>
                    <div class="chart" id="chart_guancheng"></div>
                </div>
            </div>
            <div class="you">
                <div class="thd">动态利润</div>
                <div class="tbd" id="dongli">
                    <div class="bb bb1">
                        <img src="/static/admin/images/ban/bot_6.png">
                        <div class="w1">开累产值</div>
                        <div class="w2" id="dongli_kaichan">0</div>
                    </div>
                    <div class="bb bb2">
                        <img src="/static/admin/images/ban/bot_9.png">
                        <div class="w1">实时成本</div>
                        <div class="w2" id="dongli_shicheng">0</div>
                    </div>
                    <div class="bb bb3">
                        <img src="/static/admin/images/ban/bot_5.png">
                        <div class="w1">动态利润</div>
                        <div class="w2" id="dongli_run">0</div>
                    </div>
                </div>

                <div class="thd">发票税费</div>
                <div class="tbd" id="fashui">
                    <div class="bb">
                        <div class="w1" id="fashui_xiaofa">0</div>
                        <div class="w2">销项发票</div>
                        <div class="w1" id="fashui_jinfa">0</div>
                        <div class="w2">进项发票</div>
                        <img src="/static/admin/images/ban/bot_10.png">
                    </div>
                    <div class="bb">
                        <div class="w1" id="fashui_xiaoshui">0</div>
                        <div class="w2">销项税额</div>
                        <div class="w1" id="fashui_jinshui">0</div>
                        <div class="w2">进项税额</div>
                        <img src="/static/admin/images/ban/bot_11.png">
                    </div>
                    <div class="bb">
                        <div class="w1 colorhong" id="fashui_zengshui">0</div>
                        <div class="w2">增值税</div>
                        <img src="/static/admin/images/ban/bot_15.png">
                    </div>
                </div>

                <div class="thd">质量安全</div>
                <div class="tbd" id="zhian">
                    <div class="bb">
                        <div class="w1" id="zhian_xun">0</div>
                        <div class="w2">巡检次数</div>
                        <img src="/static/admin/images/ban/bot_12.png">
                    </div>
                    <div class="bb">
                        <div class="w1" id="zhian_zheng">0</div>
                        <div class="w2">整改通知下达</div>
                        <img src="/static/admin/images/ban/bot_16.png">
                    </div>
                    <div class="bb">
                        <div class="w1" id="zhian_yigai">0</div>
                        <div class="w2">已整改</div>
                        <img src="/static/admin/images/ban/bot_13.png">
                    </div>
                    <div class="bb">
                        <div class="w1" id="zhian_daigai">0</div>
                        <div class="w2">待整改</div>
                        <img src="/static/admin/images/ban/bot_4.png">
                    </div>
                    <div class="bb">
                        <div class="w1 colorhong" id="zhian_daigaiyu">0</div>
                        <div class="w2">逾期未整改</div>
                        <img src="/static/admin/images/ban/bot_14.png">
                    </div>
                </div>

                <div class="thd">保证金</div>
                <div class="tbd" id="baojin">
                    <div class="bb">
                        <div class="w1" id="baojin_jiao">0</div>
                        <div class="w2">累计缴纳</div>
                        <img src="/static/admin/images/ban/bot_1.png">
                    </div>
                    <div class="bb">
                        <div class="w1" id="baojin_tui">0</div>
                        <div class="w2">累计退回</div>
                        <img src="/static/admin/images/ban/bot_2.png">
                    </div>
                    <div class="bb">
                        <div class="w1 colorhong" id="baojin_dai">0</div>
                        <div class="w2">待退保证金</div>
                        <img src="/static/admin/images/ban/bot_3.png">
                    </div>
                </div>
            </div>
        </div>
        <div class="clear"></div>
        <div style="height: 80px"></div>
    </div>

</div>
<script>
    layui.use(['form', 'layer', "laytp",'element','dropdown'], function() {
        var form = layui.form,element = layui.element;

        get_zi_zong_ban();
        $("#bancha").click(function (e) {
            get_zi_zong_ban();
        });
        $("#banreset").click(function () {
            window.location.reload();
        });


        form.on('select(zifen_year)', function(data){
            get_zi_chart_zifen_ban()
        });
        form.on('select(chanhe_year)', function(data){
            get_zi_chart_chanhe_ban()
        });
        form.on('select(huihe_year)', function(data){
            get_zi_chart_huihe_ban()
        });
        form.on('select(xiangzhi_year)', function(data){
            get_zi_chart_xiangzhi_ban()
        });


        function get_zi_zong_ban(){
            setTimeout(function () {
                var chanid = $("input[name='chanid']").val() || 0;
                var enginname = $("input[name='enginname']").val() || '';
                var man_xiang = $("input[name='man_xiang']").val() || '';
                var engintype = $("input[name='engintype']").val() || 0;

                facade.ajax({url: ask_zi_zong_ban, data:{
                        chanid:chanid,
                        enginname:enginname,
                        man_xiang:man_xiang,
                        engintype:engintype,
                    }}).done(function(res){
                    if (res.code === 2000) {
                        var data = res.data;
                        var toparr = data.top;

                        $("#top_zai").html(toparr.zai);
                        $("#top_shimoney").html(parseFormatNum(toparr.shimoney));
                        $("#top_chan").html(parseFormatNum(toparr.chan));
                        $("#top_huikuan").html(parseFormatNum(toparr.huikuan));
                        $("#top_yufee").html(parseFormatNum(toparr.yufee));

                        $("#enginidstr").text(data.enginidstr);
                        xmselect_dan('chanid', res.data.chanid, res.data.is_chanid)
                        xmselect_dan('engintype', res.data.engintype, res.data.is_engintype)

                        var yearStr = '';
                        var yeararr = res.data.yeararr;
                        for (var key in yeararr){
                            if(res.data.yearjin == yeararr[key]){
                                yearStr += '<option value="'+yeararr[key]+'" selected>'+yeararr[key]+'年</option>';
                            }else{
                                yearStr += '<option value="'+yeararr[key]+'">'+yeararr[key]+'年</option>';
                            }
                        }
                        $("#zifen_year").html(yearStr);
                        $("#chanhe_year").html(yearStr);
                        $("#huihe_year").html(yearStr);
                        $("#xiangzhi_year").html(yearStr);
                        render_from();

                        get_zi_dongli_ban();
                        get_zi_fashui_ban();
                        get_zi_zhian_ban();
                        get_zi_baojin_ban();
                        get_zi_zaxiang_ban();
                        get_zi_chart_zifen_ban();
                        get_zi_chart_chanhe_ban();
                        get_zi_chart_huihe_ban();
                        get_zi_chart_yingxian_ban();
                        get_zi_chart_hecai_ban();
                        get_zi_chart_xiangzhi_ban();
                        get_zi_chart_fuxian_ban();
                        get_zi_chart_zongcheng_ban();
                        get_zi_chart_guancheng_ban();
                    }
                });
            },300);
        }
        function get_zi_dongli_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_dongli_ban, data:{enginidstr:enginidstr,}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    $("#dongli_kaichan").html(parseFormatNum(data.kaichan));
                    $("#dongli_shicheng").html(parseFormatNum(data.shicheng));
                    $("#dongli_run").html(parseFormatNum(data.run));
                }
            });
        }
        function get_zi_fashui_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_fashui_ban, data:{enginidstr:enginidstr,}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    $("#fashui_xiaofa").html(parseFormatNum(data.xiaofa));
                    $("#fashui_jinfa").html(parseFormatNum(data.jinfa));
                    $("#fashui_xiaoshui").html(parseFormatNum(data.xiaoshui));
                    $("#fashui_jinshui").html(parseFormatNum(data.jinshui));
                    $("#fashui_zengshui").html(parseFormatNum(data.zengshui));
                }
            });
        }
        function get_zi_zhian_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_zhian_ban, data:{enginidstr:enginidstr,}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    $("#zhian_xun").html(data.xun);
                    $("#zhian_zheng").html(data.zheng);
                    $("#zhian_yigai").html(data.yigai);
                    $("#zhian_daigai").html(data.daigai);
                    $("#zhian_daigaiyu").html(data.daigaiyu);
                }
            });
        }
        function get_zi_baojin_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_baojin_ban, data:{enginidstr:enginidstr,}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    $("#baojin_jiao").html(parseFormatNum(data.jiao));
                    $("#baojin_tui").html(parseFormatNum(data.tui));
                    $("#baojin_dai").html(parseFormatNum(data.dai));
                }
            });
        }
        function get_zi_zaxiang_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_zaxiang_ban, data:{enginidstr:enginidstr,}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    $("#za_yufee").html(parseFormatNum(data.za_yufee));
                    $("#za_chan").html(parseFormatNum(data.za_chan));
                    $("#za_huikuan").html(parseFormatNum(data.za_huikuan));
                    $("#za_caimoney").html(parseFormatNum(data.za_caimoney));
                    $("#za_xiangzhi").html(parseFormatNum(data.za_xiangzhi));
                    $("#za_zongcheng").html(parseFormatNum(data.za_zongcheng));
                    $("#za_zhicheng").html(parseFormatNum(data.za_zhicheng));
                    $("#za_guancheng").html(parseFormatNum(data.za_guancheng));
                }
            });
        }
        function get_zi_chart_zifen_ban() {
            var enginidstr = $("#enginidstr").text();
            var year = $("#zifen_year").val();
            facade.ajax({url: ask_zi_chart_zifen_ban, data:{enginidstr:enginidstr,year:year}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_zifen('chart_zifen', res.data.shou, res.data.zhi, res.data.cha);
                }
            });
        }
        function get_zi_chart_chanhe_ban() {
            var enginidstr = $("#enginidstr").text();
            var year = $("#chanhe_year").val();
            facade.ajax({url: ask_zi_chart_chanhe_ban, data:{enginidstr:enginidstr,year:year}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_chanhe('chart_chanhe', res.data.info);
                }
            });
        }
        function get_zi_chart_huihe_ban() {
            var enginidstr = $("#enginidstr").text();
            var year = $("#huihe_year").val();
            facade.ajax({url: ask_zi_chart_huihe_ban, data:{enginidstr:enginidstr,year:year}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_huihe('chart_huihe', res.data.info);
                }
            });
        }
        function get_zi_chart_yingxian_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_chart_yingxian_ban, data:{enginidstr:enginidstr}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    $("#noshou_he").html(parseFormatNum(res.data.info.noshou_he));
                    $("#noshou_chan").html(parseFormatNum(res.data.info.noshou_chan));
                    $("#noshou_kai").html(parseFormatNum(res.data.info.noshou_kai));
                    chart_yingxian('chart_yingxian', res.data.info);
                }
            });
        }
        function get_zi_chart_hecai_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_chart_hecai_ban, data:{enginidstr:enginidstr}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_hecai('chart_hecai', res.data.info);
                }
            });
        }
        function get_zi_chart_xiangzhi_ban() {
            var enginidstr = $("#enginidstr").text();
            var year = $("#xiangzhi_year").val();
            facade.ajax({url: ask_zi_chart_xiangzhi_ban, data:{enginidstr:enginidstr,year:year}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_xiangzhi('chart_xiangzhi', res.data.info);
                }
            });
        }
        function get_zi_chart_fuxian_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_chart_fuxian_ban, data:{enginidstr:enginidstr}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;

                    $("#nofu_jie").html(parseFormatNum(res.data.info.nofu_jie));
                    $("#nofu_shou").html(parseFormatNum(res.data.info.nofu_shou));

                    chart_fuxian('chart_fuxian', res.data.info);
                }
            });
        }
        function get_zi_chart_zongcheng_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_chart_zongcheng_ban, data:{enginidstr:enginidstr}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_zongcheng('chart_zongcheng', res.data.info);
                }
            });
        }
        function get_zi_chart_guancheng_ban() {
            var enginidstr = $("#enginidstr").text();
            facade.ajax({url: ask_zi_chart_guancheng_ban, data:{enginidstr:enginidstr}}).done(function(res){
                if (res.code === 2000) {
                    var data = res.data;
                    chart_guancheng('chart_guancheng', res.data.name, res.data.value);
                }
            });
        }
    });















    function chart_zifen(chat_id, shou, zhi, cha) {
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        const colors = ['#5470C6', '#91CC75', '#EE6666'];
        option = {
            color: colors,
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                }
            },
            grid: {
                left: '15%',
                right: '26%',
                bottom: '13%'
            },
            toolbox: {
                feature: {
                    dataView: { show: true, readOnly: false },
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            },
            legend: {
                data: ['项目收款', '实际支付', '收支差']
            },
            xAxis: [
                {
                    type: 'category',
                    axisTick: {
                        alignWithLabel: true
                    },
                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '项目收款',
                    position: 'right',
                    alignTicks: true,
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: colors[0]
                        }
                    },
                    axisLabel: {
                        formatter: '{value} 元'
                    }
                },
                {
                    type: 'value',
                    name: '实际支付',
                    position: 'right',
                    alignTicks: true,
                    offset: 80,
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: colors[1]
                        }
                    },
                    axisLabel: {
                        formatter: '{value} 元'
                    }
                },
                {
                    type: 'value',
                    name: '收支差',
                    position: 'left',
                    alignTicks: true,
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: colors[2]
                        }
                    },
                    axisLabel: {
                        formatter: '{value} 元'
                    }
                }
            ],
            series: [
                {
                    name: '项目收款',
                    type: 'bar',
                    data: shou
                },
                {
                    name: '实际支付',
                    type: 'bar',
                    yAxisIndex: 1,
                    data: zhi
                },
                {
                    name: '收支差',
                    type: 'line',
                    yAxisIndex: 2,
                    itemStyle:{
                        normal:{
                            label : {
                                show: true // 在折线拐点上显示数据
                            },
                            lineStyle:{
                                width:1,  // 设置虚线宽度
                            }
                        }
                    },
                    data: cha
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_chanhe(chat_id, data) {
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            color: '#5470c6',
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                },
            },
            grid: {
                top: '15%',
                left: '20%',
                right: '10%',
                bottom: '30%'
            },
            xAxis: {
                type: 'category',
                data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    formatter: '{value} 元'
                }
            },
            series: [
                {
                    itemStyle:{
                        normal:{
                            label : {
                                show: true // 在折线拐点上显示数据
                            },
                            lineStyle:{
                                width:1,  // 设置虚线宽度
                            }
                        }
                    },
                    areaStyle: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: '#FFFFFF'
                            },
                            {
                                offset: 1,
                                color: '#5470c6'
                            }
                        ])
                    },
                    data: data,
                    type: 'line'
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_huihe(chat_id, data) {
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            color: '#ee6666',
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                },
            },
            grid: {
                top: '15%',
                left: '20%',
                right: '10%',
                bottom: '30%'
            },
            xAxis: {
                type: 'category',
                data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    formatter: '{value} 元'
                }
            },
            series: [
                {
                    itemStyle:{
                        normal:{
                            label : {
                                show: true // 在折线拐点上显示数据
                            },
                            lineStyle:{
                                width:1,  // 设置虚线宽度
                            }
                        }
                    },
                    areaStyle: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: '#FFFFFF'
                            },
                            {
                                offset: 1,
                                color: '#ee6666'
                            }
                        ])
                    },
                    data: data,
                    type: 'line'
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_yingxian(chat_id, data) {
        var info = [
            {value: data.huikuan, itemStyle: {color: '#5470c6'}},
            {value: data.xiaofa, itemStyle: {color: '#91cc75'}},
            {value: data.chan, itemStyle: {color: '#fac858'}},
            {value: data.shimoney, itemStyle: {color: '#ee6666'}}
        ];


        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            title: {
                text: ''
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            legend: {},
            grid: {
                top: '0%',
                left: '20%',
                right: '4%',
                bottom: '3%',
                containLabel: false
            },
            xAxis: {
                type: 'value',
                boundaryGap: [ 0.01]
            },
            yAxis: {
                type: 'category',
                data: ['回款金额', '累计开票', '开累产值', '合同金额']
            },
            series: [
                {
                    type: 'bar',
                    data: info
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_hecai(chat_id, data) {
        var info = [
            { value: data[1] || 0, name: '材料' },
            { value: data[2] || 0, name: '人工' },
            { value: data[3] || 0, name: '租赁' },
            { value: data[4] || 0, name: '分包' },
            { value: data[5] || 0, name: '其他' }
        ]
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            legend: {
                type: 'scroll',
                orient: 'vertical',
                right: 20,
                top: 50
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c} ({d}%)'
            },
            series: [
                {
                    name: '单位（元）',
                    type: 'pie',
                    radius: '50%',
                    data: info
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_xiangzhi(chat_id, data) {
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            color: '#73c0de',
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross'
                },
            },
            grid: {
                top: '15%',
                left: '20%',
                right: '10%',
                bottom: '30%'
            },
            xAxis: {
                type: 'category',
                data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    formatter: '{value} 元'
                }
            },
            series: [
                {
                    itemStyle:{
                        normal:{
                            label : {
                                show: true // 在折线拐点上显示数据
                            },
                            lineStyle:{
                                width:1,  // 设置虚线宽度
                            }
                        }
                    },
                    areaStyle: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                            {
                                offset: 0,
                                color: '#FFFFFF'
                            },
                            {
                                offset: 1,
                                color: '#73c0de'
                            }
                        ])
                    },
                    data: data,
                    type: 'line'
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_fuxian(chat_id, data) {
        var info = [
            {value: data.paybao, itemStyle: {color: '#5470c6'}},
            {value: data.payengin, itemStyle: {color: '#91cc75'}},
            {value: data.piaoshou, itemStyle: {color: '#fac858'}},
            {value: data.leijie, itemStyle: {color: '#ee6666'}},
            {value: data.caimoney, itemStyle: {color: '#73c0de'}}
        ];

        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            title: {
                text: ''
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            legend: {},
            grid: {
                top: '0%',
                left: '20%',
                right: '4%',
                bottom: '3%',
                containLabel: false
            },
            xAxis: {
                type: 'value',
                boundaryGap: [ 0.01]
            },
            yAxis: {
                type: 'category',
                data: ['费用报销','累计付款', '累计收票','累计结算','合同金额']
            },
            series: [
                {
                    type: 'bar',
                    data: info
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_zongcheng(chat_id, data) {
        var info = [
            { value: data.cai_fuku || 0, name: '材料费' },
            { value: data.ren_fuku || 0, name: '人工费' },
            { value: data.zu_fuku || 0, name: '租赁费' },
            { value: data.fen_fuku || 0, name: '分包费' },
            { value: data.cuo_fuku || 0, name: '措施费' }
        ]
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            legend: {
                type: 'scroll',
                orient: 'vertical',
                right: 20,
                top: 50
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c} ({d}%)'
            },
            series: [
                {
                    name: '单位（元）',
                    type: 'pie',
                    radius: '50%',
                    data: info
                }
            ]
        };
        mychat.setOption(option);
    }
    function chart_guancheng(chat_id, nameArr, valueArr) {
        var mychat = echarts.init(document.getElementById(chat_id), 'dark');
        mychat.clear();
        option = {
            xAxis: {
                type: 'category',
                data: nameArr
            },
            grid: {
                top: '5%',
                left: '15%',
                right: '3%',
                bottom: '13%'
            },
            yAxis: {
                type: 'value',
                axisLabel: {
                    formatter: '{value} 元'
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: '{a} <br/>{b} : {c}'
            },
            series: [
                {
                    itemStyle:{
                        normal:{
                            label : {
                                color:'#FFFFFF',
                                show: true // 在折线拐点上显示数据
                            },
                        }
                    },
                    name: '单位（元）',
                    data: valueArr,
                    type: 'bar',
                    showBackground: true,
                    backgroundStyle: {
                        color: 'rgba(180, 180, 180, 0.2)'
                    }
                }
            ]
        };
        mychat.setOption(option);
    }




    $("#but_ban_zi").click(function () {
        window.location.reload();
    });
    $("#but_ban_lian").click(function () {
        openNavPage('联营项目看板','ban_lian/index.php', 'ban_lian111')
    });
    $("#but_ban_cai").click(function () {
        openNavPage('财务看板','ban_cai/index.php', 'ban_cai111')
    });
</script>
</body>
</html>
